<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <!--引入vue.js库-->
    <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script> -->
    <script src="/js/vue.js"></script>
    <!-- element-ui引入样式 -->
    <link rel="stylesheet" href="/css/index.css">
    <!-- element-ui引入组件库 -->
    <script src="/js/index.js"></script>
    <!--引入axios库-->
    <!-- <script src="https://unpkg.com/axios/dist/axios.min.js"></script>-->
    <script src="/js/axios.min.js"></script>
</head>
<body>
<div id="app">
    <fieldset style="width: 400px;margin: 10% auto">
        <h2>修改密码</h2>
        <el-form :label-position="labelPosition" :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <el-form-item label="新密码" prop="pass">
                <el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="确认新密码" prop="checkPass">
                <el-input type="password" v-model="ruleForm.password" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="Update">修改</el-button>
            </el-form-item>
        </el-form>
    </fieldset>
</div>
<script>
    var vue = new Vue({
        el:'#app',
        data:{
            ruleForm: {},
            labelPosition: 'left',
            rules: {
                pass: [
                    { required: true, message: '请输入密码', trigger: 'blur' },
                    { min: 2, max: 16, message: '长度在 2 到 16 个字符', trigger: 'blur' }
                ],
                checkPass: [
                    { required: true, message: '请确认密码', trigger: 'blur' },
                    { min: 2, max: 16, message: '长度在 2 到 16 个字符', trigger: 'blur' }
                ]
            },
        },
        methods:{
            Update() {
                var _this = this;
                if (this.ruleForm.pass==this.ruleForm.password){
                    axios.post('/l/updatePw/'+this.ruleForm.password)
                        .then(function (response) {
                            console.log(response);
                            if (response.data.code == 200) {
                                axios.post('/l/logout')  //指定请求的url及参数  get
                                    .then(function (response) {
                                        console.log(response);
                                        location.href="/html/front/login.html"
                                    })
                            } else {
                                _this.$message("操作失败")
                            }
                        })
                }else {
                    _this.$message.error('两次密码不一致');
                }
            }
        }
    });
</script>
</body>
</html>